+<html>\r
+<head>\r
+ <title>The source code</title>\r
+ <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
+ <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
+</head>\r
+<body onload="prettyPrint();">\r
+ <pre class="prettyprint lang-js">Ext.onReady(function(){\r
+\r
+ new Ext.Slider({\r
+ renderTo: 'basic-slider',\r
+ width: 214,\r
+ minValue: 0,\r
+ maxValue: 100\r
+ });\r
+\r
+ new Ext.Slider({\r
+ renderTo: 'increment-slider',\r
+ width: 214,\r
+ value:50,\r
+ increment: 10,\r
+ minValue: 0,\r
+ maxValue: 100\r
+ });\r
+\r
+ new Ext.Slider({\r
+ renderTo: 'vertical-slider',\r
+ height: 214,\r
+ vertical: true,\r
+ minValue: 0,\r
+ maxValue: 100\r
+ });\r
+\r
+ new Ext.Slider({\r
+ renderTo: 'tip-slider',\r
+ width: 214,\r
+ minValue: 0,\r
+ maxValue: 100,\r
+ plugins: new Ext.ux.SliderTip()\r
+ });\r
+\r
+ var tip = new Ext.ux.SliderTip({\r
+ getText: function(slider){\r
+ return String.format('<b>{0}% complete</b>', slider.getValue());\r
+ }\r
+ });\r
+\r
+ new Ext.Slider({\r
+ renderTo: 'custom-tip-slider',\r
+ width: 214,\r
+ increment: 10,\r
+ minValue: 0,\r
+ maxValue: 100,\r
+ plugins: tip\r
+ });\r
+\r
+ new Ext.Slider({\r
+ renderTo: 'custom-slider',\r
+ width: 214,\r
+ increment: 10,\r
+ minValue: 0,\r
+ maxValue: 100,\r
+ plugins: new Ext.ux.SliderTip()\r
+ });\r
+});\r
+</pre> \r
+</body>\r
+</html>
\ No newline at end of file